<template>
  <div class="container">
    <h2 class="homeTitle">
      订单管理<i>{{ days[1] }}</i
      ><span><router-link to="/order">订单明细</router-link></span>
    </h2>
    <div class="orderviewBox">
      <ul>
        <li>
          <span class="status"
            ><i class="stayOrderIcon"></i>待接单</span
          >
          <span class="num tip"
            ><router-link to="/order?status=2" style="color: red">{{
              orderviewData.waitingOrders
            }}</router-link></span
          >
        </li>
        <li>
          <span class="status"
            ><i class="stayDeliveryIcon"></i>待派送</span
          >
          <span class="num tip"
            ><router-link to="/order?status=3" style="color: red">{{
              orderviewData.deliveredOrders
            }}</router-link></span
          >
        </li>
        <li>
          <span class="status"
            ><i class="accomplishIcon"></i>已完成</span
          >
          <span class="num"
            ><router-link to="/order?status=5" style="color: black">{{
              orderviewData.completedOrders
            }}</router-link></span
          >
        </li>
        <li>
          <span class="status"><i class="cancelIcon" ></i>已取消</span>
          <span class="num"
            ><router-link to="/order?status=6" style="color: black">{{
              orderviewData.cancelledOrders
            }}</router-link></span
          >
        </li>
        <li>
          <span class="status"><i class="allOrderIcon"></i>全部订单</span>
          <span class="num"
            ><router-link to="/order" style="color: black">{{
              orderviewData.allOrders
            }}</router-link></span
          >
        </li>
      </ul>
    </div>
  </div>
</template>

<script >
import { getday } from '@/utils/formValidate'

export default {
  name: 'OrderView',
  props: {
    orderviewData: {
      type: Object,
      required: true,
    },
  },
  computed: {
    days() {
      return getday()
    },
  },
}
</script>
